import {ScrollView, StyleSheet, Text, TouchableOpacity, View} from "react-native";
import {Image} from "expo-image";
import avator from "@/assets/images/me/avator.png";
import {useRouter} from "expo-router";


const resoureMessageComponent = function () {

    const router = useRouter();
    const goResoureMessage = function () {
        router.push("/registerGroup/resoureRoom")
    };

    return (
        <View style={styles.resoureContainer}>
           <ScrollView style={{ flex: 1, }}>
              <TouchableOpacity onPress={goResoureMessage}>
                  <View style={styles.resoureItem}>
                      <View style={styles.resoureItemTop}>
                          <View style={styles.avator}>
                              <Image source={avator} style={{ width: "100%", height: "100%" }} />
                          </View>
                          <View style={styles.nickname}>
                              <Text style={styles.nicknameText}>你宏伟</Text>
                          </View>
                      </View>
                      <View style={styles.resoureItemBody}>
                          <Text style={styles.resoureItemBodyText}>
                              我有场地【场地空间合作】寻各类型活动及内容方 进驻
                          </Text>
                      </View>
                      <View style={styles.resoureItemFooter}>
                          <Text style={styles.time}>
                              更新于 2024/12/21 10:19
                          </Text>
                          <Text style={styles.answer}>
                              应答数:15
                          </Text>
                      </View>
                  </View>
              </TouchableOpacity>
               <TouchableOpacity onPress={goResoureMessage}>
                   <View style={styles.resoureItem}>
                       <View style={styles.resoureItemTop}>
                           <View style={styles.avator}>
                               <Image source={avator} style={{ width: "100%", height: "100%" }} />
                           </View>
                           <View style={styles.nickname}>
                               <Text style={styles.nicknameText}>你宏伟</Text>
                           </View>
                       </View>
                       <View style={styles.resoureItemBody}>
                           <Text style={styles.resoureItemBodyText}>
                               我有场地【场地空间合作】寻各类型活动及内容方 进驻
                           </Text>
                       </View>
                       <View style={styles.resoureItemFooter}>
                           <Text style={styles.time}>
                               更新于 2024/12/21 10:19
                           </Text>
                           <Text style={styles.answer}>
                               应答数:15
                           </Text>
                       </View>
                   </View>
               </TouchableOpacity>
               <TouchableOpacity onPress={goResoureMessage}>
                   <View style={styles.resoureItem}>
                       <View style={styles.resoureItemTop}>
                           <View style={styles.avator}>
                               <Image source={avator} style={{ width: "100%", height: "100%" }} />
                           </View>
                           <View style={styles.nickname}>
                               <Text style={styles.nicknameText}>你宏伟</Text>
                           </View>
                       </View>
                       <View style={styles.resoureItemBody}>
                           <Text style={styles.resoureItemBodyText}>
                               我有场地【场地空间合作】寻各类型活动及内容方 进驻
                           </Text>
                       </View>
                       <View style={styles.resoureItemFooter}>
                           <Text style={styles.time}>
                               更新于 2024/12/21 10:19
                           </Text>
                           <Text style={styles.answer}>
                               应答数:15
                           </Text>
                       </View>
                   </View>
               </TouchableOpacity>
           </ScrollView>
        </View>
    )
};

const styles = StyleSheet.create({
    resoureContainer: {
        paddingHorizontal: 12,
        flex: 1,
        marginTop: 6,
    },
    resoureItem: {
        padding: 10,
        backgroundColor: "#fff",
        borderRadius: 8,
        marginBottom: 12,
    },
    resoureItemTop: {
        flexDirection: "row",
        alignItems: "center",
        borderBottomWidth: 0.3,
        borderBottomColor: "#E4E6EC",
        paddingBottom: 10,
    },
    avator: {
        width: 36,
        height: 36,
    },
    nickname: {
        marginLeft: 10,
    },
    nicknameText: {},
    resoureItemBody: {
        paddingTop: 10,
    },
    resoureItemBodyText: {
        fontWeight: "bold"
    },
    resoureItemFooter: {
        flexDirection: "row",
        marginTop: 10,
    },
    time: {
        color: "#9C9EAC",
        fontSize: 12,
    },
    answer: {
        color: "#9C9EAC",
        fontSize: 12,
        marginLeft: 30,
    },
});

export default resoureMessageComponent;
